<template>
	<view class="block mainpadding" v-if="pageShow">
		<!-- 分享弹框 -->
		<u-popup :show="show" @close="close">
			<view>
				<view class="mainpadding xiahuaxian dingwei">
					<view class="sanshier fonweight xiaohei textcenter" @click="show = true">分享到</view>
					<view class="guandys" @click="close">
						<u-icon name="close"></u-icon>
					</view>
					<view class="mainpadding">
						<view class="flexleft ">
							<view class="margin_right6" @click="appweixin()">
								<view class="weixin marginauto"></view>
								<view class="xiaohei ershiba nofonweight textcenter margin_top1">微信</view>
							</view>
							<view class="flexleft">
								<view class=""  @click="apppengyouquan()">
									<view class="pengyouq marginauto"></view>
									<view class="xiaohei ershiba nofonweight textcenter margin_top1">朋友圈</view>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</u-popup>
		<view class="mainpadding ffffff radius">
			<view class="flexleft">
				<image class="huiyuantb margin_right1" :src="dataAll.user.avatar_text" mode=""></image>
				<view class="">
					<view class="sanshier xiaohei fonweight">{{dataAll.user.nickname}}</view>
					<view class="ershil nofonweight xiaohuang margin_top1">
						我发现一个精品课程，快来呼朋唤友砍价吧~
					</view>
				</view>
			</view>
			<view class="margin_top2 huibox mainpadding2s">
				<view class="flexbetween">
					<view class="shilitu">
						<image :src="dataAll.kc.image_text" mode=""></image>
					</view>
					<view class="" style="width: 63%;">
						<view class="titletext xiaohei fonweight yhxk">{{dataAll.kc.name}} </view>
						<view class="strongtext xiaohui nofonweight margin_top2 yhxk">{{dataAll.kc.kc_des}} </view>
						<view class="titletext xiaohong fonweight margin_top2">¥ {{dataAll.price}}</view>
					</view>
				</view>
			</view>
			<view class="flexcenter margin_top4">
				<view class="ershiba xiaohei fonweight">已砍</view>
				<view class="ershiba xiaohong fonweight">{{dataAll.yk_price}}</view>
				<view class="ershiba xiaohei fonweight">元，还差</view>
				<view class="ershiba xiaohong fonweight">{{dataAll.sy_price}}
					<text class="ershiba xiaohei fonweight">元</text>
				</view>
			</view>
			<!-- #ifdef MP-WEIXIN -->
			<button open-type="share" hover-class="none">
				<view class="hungbht margin_top2" v-if="userid==dataAll.user_id && Number(dataAll.sy_price)!=0">分享给好友，多砍一刀</view>
			</button>
			<!-- #endif -->
			<!-- #ifdef APP-PLUS || H5 -->
			<view class="hungbht margin_top2" @click="appweixin()" v-if="userid==dataAll.user_id && Number(dataAll.sy_price)!=0">分享给好友，多砍一刀</view>
			<!-- #endif -->
			<view class="hungbht margin_top2"	v-if="userid==dataAll.user_id  && Number(dataAll.sy_price)==0">砍价成功</view>
			<view class="hungbht margin_top2" v-if="userid!=dataAll.user_id && !dataAll.userkcklrecord" @click="hykd()">帮他砍一刀</view>
			<view class="huibht margin_top2"  v-if="userid!=dataAll.user_id && dataAll.userkcklrecord">你已经砍过了</view>
			<view class="flexcenter margin_top4">
				<view class="ershiba xiaohei nofonweight">还剩</view>
				<u-count-down :time="Number(dataAll.end_time)*1000 - Number(new Date())"
					format="HH:mm:ss"></u-count-down>
				<view class="ershiba xiaohei nofonweight">过期，快来砍价吧~</view>
			</view>
			<view class="zongbox mainpadding flexcenter margin_top4">
				<view class="titletext xiaohei fonweight">好友助力列表</view>
			</view>
			<view class="qianhxo mainpadding">
				<view class="flexbetween margin_top2" v-for="item in dataAll.kckjrecord" :key="item.id">
					<view class="flexleft">
						<view class="touxiang margin_right2">
							<image :src="item.user.avatar_text" mode=""></image>
						</view>
						<view class="ershiba xiaohei nofonweight">{{item.user.nickname}}</view>
					</view>
					<view class="flexright">
						<view class="ershiba xiaohei nofonweight">砍掉</view>
						<view class="ershiba xiaohong nofonweight">{{item.price}}</view>
						<view class="ershiba xiaohei nofonweight">元</view>
					</view>
				</view>
			</view>
		</view>
	</view>
	</view>
</template>

<script>
	const httpRequest = require("@/common/httpRequest.js")
	export default {
		data() {
			return {
				show: false,
				listid: "",
				dataAll: {},
				pageShow: false,
				userid: "",
			}
		},
		onLoad(options) {
			this.listid = options.id
		},
		onShow() {
			this.userid = uni.getStorageSync("user_id")
			this.getDetail()
		},
		// #ifdef MP-WEIXIN
		onShareAppMessage() {
			let that = this
			return {
				title: "动佳",
				path: "/pages_homepage/kanjia?id=" + that.listid,
			}
		},
		// #endif
		methods: {
			
			fxhy() {
				if (!httpRequest.checkIsLogin()) {
					uni.navigateTo({
						url: "/pages/login/login"
					})
					return false
				}
				this.show = true
			},
			// 微信
			// app分享小程序 详情参考https://uniapp.dcloud.net.cn/api/plugins/share.html
			appweixin() {
				let that = this
				uni.share({
					provider: 'weixin', //分享服务提供商（即weixin|qq|sinaweibo）
					scene: "WXSceneSession", //WXSceneSession(分享到聊天界面)、WXSenceTimeline(分享到朋友圈)、WXSceneFavorite(分享到微信收藏)
					type: 5,
					imageUrl: 'https://moveadd.yuntaiqi.com/uploads/20231209/73eb7695f5b6a32b51d8946b6fce1acc.png',
					miniProgram :{
						id:"gh_bde51ae6eadc",
						path:"/pages_homepage/kanjia?id="+that.listid,
						type:2,
						webUrl:"http://uniapp.dcloud.io",
					},
					success: function(res) {
						console.log("success:" + JSON.stringify(res));
					},
					fail: function(err) {
						console.log("fail:" + JSON.stringify(err));
					}
				});
			},
			
			// 朋友圈
			apppengyouquan() {
				let that = this
				uni.share({
					provider: 'weixin', //分享服务提供商（即weixin|qq|sinaweibo）
					scene: "WXSenceTimeline", //WXSceneSession(分享到聊天界面)、WXSenceTimeline(分享到朋友圈)、WXSceneFavorite(分享到微信收藏)
					type: 5,
					imageUrl: 'https://moveadd.yuntaiqi.com/uploads/20231209/73eb7695f5b6a32b51d8946b6fce1acc.png',
					miniProgram :{
						id:"gh_bde51ae6eadc",
						path:"/pages_homepage/kanjia?id="+that.listid,
						type:2,
						webUrl:"http://uniapp.dcloud.io",
					},
					success: function(res) {
						console.log("success:" + JSON.stringify(res));
					},
					fail: function(err) {
						console.log("fail:" + JSON.stringify(err));
					}
				});
			},
			hykd() {
				if (!httpRequest.checkIsLogin()) {
					uni.navigateTo({
						url: "/pages/login/login"
					})
					return false
				}
				httpRequest.request('/api/user/addKcKjRecord', 'GET', {
					kc_kj_id: this.listid
				}, false, false, true).then(res => {
					httpRequest.toast(res.msg)
					if (res.code == 1) {
						this.getDetail()
					}
				})
			},
			getDetail() {
				httpRequest.request('/api/kccl/kcKjDetail', 'GET', {
					kc_kj_id: this.listid
				}, false, false, true).then(res => {
					this.dataAll = res.data
					this.pageShow = true
				})
			},
			close() {
				this.show = false
			},
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep.u-count-down__text {
		color: #ff0000 !important;
	}

	.guandys {
		position: absolute;
		right: 30rpx;
		top: 30rpx;
	}

	.touxiang {
		width: 52rpx;
		height: 52rpx;
		border-radius: 50%;

		image {
			border-radius: 50%;
			width: 100%;
			height: 100%;
		}
	}

	.qianhxo {
		background: #F9F9F9;
		border-radius: 0 0 16rpx 16rpx;
	}

	.zongbox {
		background: #F5F5F5;
		border-radius: 16rpx 16rpx 0rpx 0rpx;
	}

	.hungbht {
		width: 646rpx;
		height: 88rpx;
		background: #F8B900;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		font-size: 32rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	.huibht {
		width: 646rpx;
		height: 88rpx;
		background: #9a9a9a;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		font-size: 32rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.shilitu {
		width: 200rpx;
		height: 160rpx;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.huibox {
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		background: #F9F9F9;
	}

	.huiyuantb {
		width: 132rpx;
		height: 132rpx;
		border-radius: 50%;
	}

	.block {
		background: #F8B900;
		height: calc(100vh - 140rpx);
	}
</style>